<template>
    <div class="content_panel project_modules">
        <div class="content_panel_top">
            <h3 class="panel_title">
                <span>{{ $t('finance.withdrawalFailed') }}</span><!--提现失败-->
            </h3>
            <el-form ref="form" :model="form" :rules="rules" :inline="false" class="module_form">
                <el-row :gutter="20">
                    <el-col :span="4">
                        <el-form-item prop="orderId">
                            <el-input v-model="form.orderId" :placeholder="$t('common.orderId')" clearable><!--订单号--></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="4">
                        <el-form-item prop="appName" label="">
                            <select-app-list v-model="form.appName" :placeholder="$t('system.appName')"></select-app-list><!--app名称-->
                        </el-form-item>
                    </el-col>
                    <el-col :span="4">
                        <el-form-item prop="userPhone">
                            <el-input v-model="form.userPhone" :placeholder="$t('common.mobileNumber')" clearable><!--手机号码--></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="4">
                        <el-form-item prop="userId">
                            <el-input v-model="form.userId" placeholder="UserId" clearable></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8"> <!--放款方式-->
                        <el-form-item prop="payChannel" label="">
                            <el-select v-model="form.payChannel" clearable :placeholder="$t('common.loanType')" style="width: 100%;">
                                <el-option v-for="item in keyMap.loanChannel" :key="item.value" :label="item.label" :value="item.value" v-if="item.active===1"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="5">
                        <el-form-item prop="withdrawAccount">
                            <el-input v-model="form.withdrawAccount" :placeholder="$t('common.receiptAccount')" clearable><!--收款账号--></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="9">
                        <el-form-item>
                            <el-button @click="search" icon="el-icon-search" type="primary">{{ $t('common.search') }}</el-button>
                            <el-button @click="exportExcel" icon="el-icon-upload2" type="primary">{{ $t('common.export') }}</el-button>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form><!--el-form end-->
        </div><!--content_panel_top-->
        <div class="module_content">
            <div class="content_panel project_modules">
                <div class="table_list">
                    <el-table ref="table" :data="tableData" style="width: 100%;" @selection-change="handleTableSelect" :max-height="tableMaxHeight" :highlight-current-row="true">
                        <el-table-column :label="$t('common.allChoose')" type="selection"></el-table-column>
                        <el-table-column :label="$t('common.operation')" min-width="120">
                            <template slot-scope="{ row }">
                                <el-button type="text" @click="showRefuse(row)">{{ $t('common.refuse') }}</el-button>
                                <el-button type="text" @click="showPass(row)">{{ $t('common.pass') }}</el-button>
                            </template>
                        </el-table-column>
                        <!-- <el-table-column label="UserId" prop="userId" min-width="120"></el-table-column> -->
                        <el-table-column :label="$t('common.mobileNumber')" prop="userPhone" min-width="150"><!--手机号码--></el-table-column>
                        <el-table-column :label="$t('common.loanSerialNumber')" prop="controlNumber" min-width="150"><!----></el-table-column>
                        <el-table-column :label="$t('system.appName')" prop="appName" min-width="130"></el-table-column><!--APP名称-->
                        <el-table-column :label="$t('system.appPackage')" prop="appPackage" min-width="150"></el-table-column><!---->

                        <el-table-column :label="$t('common.failReason')" prop="failureReasons" :show-tooltip-when-overflow="true" min-width="180"></el-table-column><!--失败原因-->
                        <el-table-column :label="$t('common.orderId')" prop="orderId" min-width="200"><!--内部订单号--></el-table-column>
                        <el-table-column :label="$t('common.receiptAccount')" prop="withdrawAccount" min-width="180"><!--收款账号--></el-table-column>
                        <el-table-column :label="$t('common.loanType')" prop="payChannel" min-width="180"><!--放款方式-->
                            <template slot-scope="{ row }">{{ row.payChannel | SwitchLoanChannel }}</template>
                        </el-table-column>
                        <el-table-column :label="$t('common.loanChannel')" prop="withdrawChannel" min-width="180"><!--放款渠道-->
                            <template slot-scope="{ row }">{{ row.withdrawChannel | SwitchChannelCompany }}</template>
                        </el-table-column>
                        <el-table-column :label="$t('finance.withdrawalAmount')" prop="withdrawAmount" min-width="150"><!--提现金额--></el-table-column>
                        <el-table-column :label="$t('common.loanTime')" prop="withdrawTime" min-width="180">
                            <template slot-scope="{ row }">{{ row.withdrawTime | formatDate('yyyy-MM-dd hh:mm:ss') }}</template><!--放款时间-->
                        </el-table-column>
                    </el-table>
                    <div v-show="tableData.length" class="table_bottom_btns">
                        <el-button @click="showBatchRefuse" type="primary" :disabled="selectedIdList.ids.length === 0" size="small">{{ $t('common.batchRefuse') }}</el-button>
                    </div>
                    <!--分页组件-->
                    <pagination @pageChange="pageChange" :page="page"></pagination>
                </div><!--module_content-->
            </div>
        </div><!--module_content-->

        <!--拒绝放款弹框start-->
        <el-dialog :title="$t('common.refuseReason')" :visible.sync="showRefuseDialog" width="460px">
            <el-form :form="refuseForm">
<!--                <el-form-item :label="$t('common.orderId')">{{ refuseForm.orderId }}</el-form-item>-->
                <el-form-item :label="refuseForm.label">
                    <el-input type="textarea" v-model="refuseForm.reason" :placeholder="$t('common.refuseReason')" :rows="8" :maxlength="200"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer">
                <el-button type="primary" @click="batchRefuse" v-if="showBatchRefuseButton">{{ $t('common.batchSubmit') }}</el-button>
                <el-button type="primary" @click="refuse" v-else>{{ $t('common.submit') }}</el-button>
                <el-button type="cancel" @click="showRefuseDialog = false">{{ $t('common.cancel') }}</el-button>
            </div>
        </el-dialog>
        <!--拒绝放款弹框end-->

    </div>
</template>

<script src="./main.js"></script>
<style lang="scss" scoped>
</style>
